<template>
  <div>
    <h2>房型修改</h2>
    <hr />
    <table>
      <tr>
        <td>房型名称:</td>
        <td>
          <input type="text" v-model="state.fxName" />
        </td>
      </tr>
      <tr>
        <td>门市价格:</td>
        <td>
          <input type="number" v-model="state.msPrice" />
        </td>
      </tr>
      <tr>
        <td>房间数量:</td>
        <td>
          <input type="number" v-model="state.fxNum" />
        </td>
      </tr>
      <tr>
        <td>房号:</td>
        <td v-for="item in list" >
          <input  type="checkbox" v-model="state.fhId"  :value="item.fh"/>{{item.fh}}
        </td>
      </tr>
      <tr>
        <td>房型状态:</td>
        <td>
          <input type="radio" v-model="state.fxzt" :value="true" checked />启用
          <input type="radio" v-model="state.fxzt" :value="false" />停用
        </td>
      </tr>
      <tr>
        <td>
          <input type="button" value="房型修改" @click="FangXingAdd" />
        </td>
        <td>
          <input type="button" value="房型列表" @click="FangXingShow" />
        </td>
      </tr>
    </table>
  </div>
</template>

<script setup lang="ts">
import { reactive, toRefs, onMounted } from 'vue';
import { useRouter, useRoute } from 'vue-router';
import axios from 'axios';

const router = useRouter();
const route = useRoute();

let data: any = reactive({
  state: {
    fxName: '',
    fhId: '',
    msPrice: 0,
    fxNum: 0,
    fxzt: true,
    fxIsDeleted: false,
  },
  list:[]
});

let { state,list } = toRefs(data);
onMounted(() => {
  FangHaoShow()
  FangXingXiouGai()
})

function FangXingXiouGai(){
  axios({
    url:'https://localhost:7071/api/FangXing/FangXingFan',
    method:'get',
    params:{
      FXId:route.query.FXId
    }
  })
  .then(res=>{
    
    state.value=res.data.data
   
  })
  .catch(err=>{
    console.log(err)
  
  })
}

function FangHaoShow(){
  axios({
    url:'https://localhost:7071/api/FangHao/FangHaoShow',
    method:'get',
  
  })
  .then(res=>{
    list.value=res.data.data
    state.value.fhId=list.value.fh

  })
  .catch(err=>{
    console.log(err)
  
  })
}
function FangXingShow(){
  router.push('/FangXingShow')
}


function FangXingAdd() {
  let obj = {
    fxId:route.query.FXId,
    fhId:"BW1001,BW1002,BW1003,BW1004",
    fxName:state.value.fxName,
    msPrice:state.value.msPrice,
    fxNum:state.value.fxNum,
    fxzt:state.value.fxzt,
    fxIsDeleted:state.value.fxIsDeleted,
  };
  console.log(obj)
  axios({
    url:'https://localhost:7071/api/FangXing/FangXingXiouGai',
    method:'post',
    data:obj
  })
  .then(res=>{
  
  if(res.data.data>0)
  {
    alert('修改成功')
    router.push('/FangXingShow')
  }
  else{
    alert('修改失败')
    return
  }
  })

}
</script>

<style scoped></style>
